<template>
	<UserCardList :user-list="userList" />
	<up-empty v-if="!userList || userList.length < 1" text="无符合的用户" icon="http://cdn.uviewui.com/uview/empty/data.png">
	</up-empty>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'; // UniApp 的生命周期
	import {
		ref
	} from 'vue';
	import UserCardList from '@/components/UserCardList.vue'; // 用户卡片列表组件
	import myAxios from '@/plugins/myAxios'; // 请求封装模块

	// 数据
	const userList = ref([]);


	// 生命周期：页面加载
	onLoad(async (options) => {
		// 从页面参数中获取 tags
		const {
			tags
		} = options;

		// 解析标签
		let tagList = [];
		try {
			tagList = JSON.parse(decodeURIComponent(tags));
		} catch (error) {
			uni.showToast({
				title: '标签格式错误',
				icon: 'none',
			});
			return;
		}

		// 检查标签是否为空
		if (!Array.isArray(tagList) || tagList.length === 0) {
			uni.showToast({
				title: '请提供有效的标签',
				icon: 'none',
			});
			return;
		}

		try {
			// 发起请求，传递整个标签数组
			const response = await myAxios.get('/user/search/tags', {
				tagNameList: tagList // 传递整个标签数组
			});

			const userListData = response?.data;

			if (userListData) {
				userList.value = userListData;
			}
		} catch (error) {
			// 错误处理
			console.error('请求失败:', error.message);
			uni.showToast({
				title: '请求失败，请稍后再试',
				icon: 'none',
			});
		}
	});
</script>

<style scoped></style>